<template>
  <van-nav-bar title="种草推荐" left-arrow @click-left="router.back()">
    <template #right>
      <van-icon name="add-o" />
    </template>
  </van-nav-bar>
  <div class="list">
    <van-list
      finished-text="没有更多数据了！ 别划了"
      :finished="finished"
      v-model:loading="loading"
      @load="onLoad"
      :offset="10"
    >
      <div
        class="comments-item"
        v-for="(item, index) in list"
        :key="index"
      >
        遍历种草文章{{ index }}
      </div>
    </van-list>
  </div>
</template>

<script setup>
import { onMounted, ref, reactive } from "vue";
import { useRouter } from "vue-router";
import { getComments } from "@/api/comment";
import usePageList from '@/Hooks/usePageList'
// 获取路由器实例
let router = useRouter();
let {onLoad,loading,finished,list}=usePageList(getComments,{ limit: 10, page: 1 })
</script>

<style scoped lang="scss">
.list {
  margin-bottom: 50px;
  .comments-item {
    height: 100px;
    background-color: bisque;
    margin-bottom: 6px;
  }
}

</style>

